// Import the theme
@import '~@pitrix/lego-ui/lib/scss/themes/default';
@import 'variables';

$family-serif: $font-family;
$family-monospace: $font-family-id;
$body-family: $font-family;

$primary: $green;
$neutral-15: $text-color;
$strong-color: $text-color;

$radius: $border-radius;
$radius-small: 4px;

$link: $text-color;
$link-visited: $text-color;
$link-hover: lighten($primary, 2%);
$link-hover-border: $neutral-3;
$link-focus: darken($primary, 2%);
$link-focus-border: $neutral-3;
$link-active: darken($primary, 2%);
$link-active-border: $neutral-3;

// ------ Menu ------
$button-border-radius-base: 16px;

// ------ Menu ------
$menu-item-color: $third-text-color;
$menu-item-hover-color: $third-text-color;
$menu-item-active-color: $third-text-color;
$menu-font-size: $size-small;
$menu-item-radius: 20px;
$menu-border: none;
$menu-border-radius: $border-radius;
$menu-item-height: 35px;
$menu-item-hover-background-color: $select-option-hover-bg;
$menu-item-active-background-color: $select-option-hover-bg;

// ------ Dropdown ------
$popper-border: none;
$popper-border-radius: $border-radius;
$popper-box-shadow: 0 4px 16px 0 rgba(39, 50, 71, 0.28);
$popper-arrow-border-color: $light-color04;

$dropdown-content-radius: $border-radius;

// ------ alert ------
$alert-border-radius: $border-radius;
$alert-line-height: 1.67;
$alert-padding: 12px 12px 12px 38px;
$alert-no-icon-padding: 12px;
$alert-color: #326e93;
$alert-info-border-color: transparent;
$alert-info-background-color: rgba(199, 222, 239, 0.54);
$alert-info-link-button-color: #1b86bb;
$alert-info-link-button-hover-color: #2191ca;
$alert-info-link-button-active-color: #1577a8;

// ------ ToolTip ------
$tooltip-z: 1000;
$tooltip-background: rgba(36, 46, 66, 0.97);
$tooltip-color: $white;
$tooltip-padding: 12px;
$tooltip-font-size: $body-size;
$tooltip-box-shadow: 0 6px 12px 0 rgba(2, 5, 8, 0.08),
  0 1px 2px 0 rgba(2, 5, 8, 0.08);
$tooltip-margin: 8px;
$tooltip-border-radius: 4px;
$tooltip-arrow-margin: 6px;
$tooltip-arrow-border: 6px;
$tooltip-max-width: 300px;

// ------ Form ------
$label-color: $third-text-color;
$label-weight: normal;
$field-margin-bottom: 12px;

// ------ Input ------
$input-color: $third-text-color;
$input-background-color: $white;
$input-border-color: $border-color;
$input-shadow: none;
$input-hover-color: $input-color;
$input-hover-border-color: #b5c2c9;
$input-focus-color: $input-color;
$input-focus-border-color: $primary;
$input-focus-box-shadow-size: none;
$input-disabled-color: $input-color;
$input-disabled-background-color: #ebf0f3;
$input-disabled-border-color: $input-border-color;
$input-disabled-opacity: 1;
$input-arrow: $link;
$input-icon-color: $grey;
$input-icon-active-color: $dark-color06;
$input-radius: 5px;

// ------ Select ------
// control options
$select-input-bg: $white;
$select-input-bg-opacity: 1;
$select-input-bg-hover: $white;
$select-input-bg-focus: $white;
$select-input-border-color: $border-color;
$select-input-border-radius: 4px;
$select-input-border-focus: $primary;
$select-input-box-shadow: none;
$select-input-border-width: 1px;
$select-input-height: 32px;
$select-input-height-sm: 28px;
$select-input-height-lg: 40px;
$select-input-internal-height: (
  $select-input-height - ($select-input-border-width * 2)
);
$select-input-internal-height-sm: (
  $select-input-height-sm - ($select-input-border-width * 2)
);
$select-input-internal-height-lg: (
  $select-input-height-lg - ($select-input-border-width * 2)
);
$select-input-placeholder: $placeholder-color;
$select-text-color: $text-color;
$select-link-hover-color: $select-input-border-focus;
$select-input-hover-box-shadow: none;
$select-padding-vertical: 4px;
$select-padding-horizontal: 12px;
// menu options
$select-menu-z: 1000;
$select-menu-top: 4px;
$select-menu-max-height: 230px;
$select-menu-border-color: transparent;
$select-menu-box-shadow: 0 4px 16px 0 rgba(39, 50, 71, 0.28);
$select-option-color: $select-text-color;
$select-option-bg: $white;
$select-option-focused-color: $select-text-color;
$select-option-focused-bg: $select-option-hover-bg;
$select-option-selected-color: $select-text-color;
$select-option-selected-bg: $select-option-hover-bg;
$select-option-disabled-opacity: 0.5;
$select-noresults-color: $neutral-8;
// multi-select item
$select-multi-padding-horizontal: 6px;
$select-item-gutter: 0;
$select-item-padding-vertical: 4px;
$select-item-padding-horizontal: 4px;
$select-item-font-size: 12px;
$select-item-disabled-opacity: 0.5;

// ------ Modal ------
$modal-z: 2000; // consistent with components/Base/Modal
$modal-card-head-radius: $radius;
$modal-card-foot-radius: $radius;
$modal-card-title-color: $title-color;
$modal-card-title-size: $size-normal;

// ------ Table ------
$table-row-hover-bg: $th-bg-color;
$table-row-selected-bg: $th-bg-color;
$table-thead-th-border-bottom: 1px solid $light;
$table-tbody-td-border-bottom: 1px solid $light;

// Import the icons
@import '~@pitrix/lego-ui/lib/scss/base/icon';

// Import the core styles of components
@import '~@pitrix/lego-ui/lib/scss/core.scss';
